<template>
	<view class="setting">
		<u-navbar
			title="设置"
			autoBack
			:placeholder="true"
		></u-navbar>
		<view class="content">
			<view class="setting-item" v-for="(item,index) in settingItem" :key="index" @click="settingClick(item.url)">
				<view class="setting-item__title">{{ item.title }}</view>
				<view class="setting-item__more">
					<u-icon name="arrow-right"></u-icon>
				</view>
			</view>
			<view class="setting-logout">
				<u-button text="退出登录" color="#f56c6c" shape="circle" @click="logout"></u-button>
			</view>
		</view>
		<u-toast ref="uToastRef"></u-toast>
	</view>
</template>

<script lang="ts" setup>
	import { ref } from "vue"
	
	const uToastRef = ref()
	const settingItem = ref([
		{
			title: "个人资料",
			url: "/user/user_info/user_info"
		},
		{
			title: "支付密码设置",
			url: "/user/pay_secret/pay_secret"
		},
		{
			title: "关于我们",
			url: "/pages/index/index"
		}
	])
	
	const settingClick = (url: string) => {
		uni.navigateTo({
			url: url
		})
	}
	
	const logout = () => {
		uni.removeStorageSync("info")
		uni.removeStorageSync("token")
		uToastRef.value.show({
			type: 'success',
			message: "已退出登录",
			duration: 1200,
			complete: () => {
				uni.redirectTo({
					url: "/pages/index/index"
				})
			}
		})
	}
</script>

<style lang="scss">
@import "style.scss"
</style>
